<template>
	<view>
		<view v-if="isPass===0">
			<view class="content">
				<view class="title">
					基本信息
				</view>
				<view class="a1">
					<view class="flex1">
						<view class="item1">

							<span>*</span>头像
						</view>
						<view class="item2">
							<button class="wx-btn" open-type="chooseAvatar" @chooseavatar="chooseAvatar"
								@click="chooseAvatar">
								<image :src="editUserInfo.avatar||'https://pw.qyang.cc/static/defult_avatar.png'">
								</image>
								<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
							</button>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>昵称
						</view>
						<view class="item2">
							<u-input type="nickname" @change="getName" placeholder="请输入" border="none"
								inputAlign="right" v-model='editUserInfo.nickname'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>性别
						</view>
						<view class="item2" @click="showSex = !showSex">
							<!-- <u-input style="background: rgba(0,0,0,0);" placeholder="请选择" disabled border="none" inputAlign="right" v-model='sex'></u-input> -->
							<u-input placeholder="请选择" v-model="sex" border="none" disabled disabledColor="#fff"
								inputAlign="right"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>年龄
						</view>
						<view class="item2">
							<u-input type="number" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.age'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>身高（cm）
						</view>
						<view class="item2">
							<u-input type="number" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.cm'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>体重（kg）
						</view>
						<view class="item2">
							<u-input type="number" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.kg'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>职业
						</view>
						<view class="item2">
							<u-input type="text" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.occupation'></u-input>
						</view>
					</view>
					<view class="flex1" style="border: 0;">
						<view class="item1">
							<span style="visibility: hidden;">*</span>
							简介
							</view>
						<view class="item2" @click="goPage('jianjie')">
							<u-input placeholder="请设置" border="none" disabled disabledColor="#fff" inputAlign="right"
								v-model='editUserInfo.bio'></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
				</view>
				<view class="title">
					更多信息
				</view>
				<view class="a1">
					<view class="flex1">
						<view class="item1">
							<span>*</span>电话
						</view>
						<view class="item2">
							<u-input type="number" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.mobile'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>微信
						</view>
						<view class="item2">
							<u-input type="text" placeholder="请输入" border="none" inputAlign="right"
								v-model='editUserInfo.wechat_account'></u-input>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>缩略图
						</view>
						<view class="item2" @click="goPage('videoImage')">
							<u-input placeholder="请上传" v-model="uploadImage" border="none" disabled disabledColor="#fff"
								inputAlign="right"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span style="visibility: hidden;">*</span>
							视频
						</view>
						<view class="item2" @click="goPage('video')">
							<u-input placeholder="请上传" v-model="uploadVideo" border="none" disabled disabledColor="#fff"
								inputAlign="right"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>相册
						</view>
						<view class="item2" @click="goPage('photo')">
							<u-input placeholder="请上传" v-model="uploadPhoto" border="none" disabled disabledColor="#fff"
								inputAlign="right"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
				</view>
				<view class="title">
					入驻信息
				</view>
				<view class="a1">
					<view class="flex1">
						<view class="item1">
							<span>*</span>城市
						</view>
						<view class="item2">
							<pickerAddress :code="editUserInfo.city" @change="areaChange">
								<view class="item2">
									<!-- <u-input placeholder="请选择" border="none" inputAlign="right"
										v-model='city'></u-input> -->
									<u-input placeholder="请选择" v-model="city" border="none" disabled disabledColor="#fff"
										inputAlign="right"></u-input>
									<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
								</view>
							</pickerAddress>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span>*</span>类目
						</view>
						<view class="item2" @click="showCategory = !showCategory">
							<!-- <u-input placeholder="请选择" border="none" inputAlign="right" v-model='category'></u-input> -->
							<u-input placeholder="请选择" v-model="category" border="none" disabled disabledColor="#fff"
								inputAlign="right"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
					<view class="flex1">
						<view class="item1">
							<span style="visibility: hidden;">*</span>
							实名
						</view>
						<view class="item2" @click="goPage('real')">
								<u-input placeholder="请认证" border="none" inputAlign="right"
								v-model='realName' disabled disabledColor="#fff"></u-input>
							<u-icon name="arrow-right" size="14" color="#d2d2d2"></u-icon>
						</view>
					</view>
				</view>

				<view class="check" @click="changeRadio()">
					<radio :value="radio" :checked="radio" color="#F4858A" borderColor="#F4858A"
						style="transform: scale(0.75)" />
					已阅读并同意 <span @click="agreement('enter','入驻协议')" class="text">《入驻协议》</span>
					和<span class="text" @click="agreement('billing_rule','计费规则')">《计费规则》</span>
				</view>
			</view>

			<view class="bottom">
				<view class="btn" @click="submit">提交审核</view>
			</view>
			<u-picker :show="showSex" :columns="columnsSex" keyName="label" @confirm="confirmSex"
				@cancel="showSex = false"></u-picker>
			<u-picker :show="showCategory" :columns="columnsCategory" keyName="name" @cancel="showCategory=false"
				@confirm="confirmCategory"></u-picker>
		</view>
		<view v-if="isPass===1" class="app-content">
			<image src="https://pw.qyang.cc/static/svg/paySuccess.svg" mode="aspectFill">
			</image>
			<view class="text">
				审核通过
			</view>
			<view class="btn" @click="newSubmit">修改信息</view>
		</view>
		<view v-if="isPass===2" class="app-content">
			<image src="https://pw.qyang.cc/static/commit-fail.png" mode="">
			</image>
			<view class="text1">
				审核驳回
			</view>
			<view class="text2">
				驳回原因：{{msg}}
			</view>
			<view class="btn" @click="newSubmit">重新提交</view>
		</view>


		<view v-if="isPass===9" class="app-content">
			<image src="https://pw.qyang.cc/static/svg/paySuccess.svg" mode="aspectFill">
			</image>
			<view class="text9">
				提交成功
			</view>
			<view class="text19">
				请等待平台审核通过
			</view>

		</view>

	</view>
</template>

<script>
	import pickerAddress from '@/components/pickerAddress/pickerAddress.vue';
	export default {
		components: {
			pickerAddress
		},
		data() {
			return {
				isPass: -1, //0未申请，1通过  2未通过
				userInfo: {},
				editUserInfo: {},
				sex: '',
				category: '',
				city: '',
				radio: false,
				showSex: false,
				showCategory: false,
				columnsSex: [
					[{
							label: '男',
							id: 1
						},
						{
							label: '女',
							id: 0
						}
					]
				],
				columnsCategory: [],
				uploadImage: '',
				uploadVideo: '',
				uploadPhoto: '',
				realName: '',
				id: null,
				msg: '',
				loading: true
			};
		},
		onLoad() {
			uni.showLoading({})
			var that = this
			let userInfo = JSON.parse(uni.getStorageSync('userInfo'))
			this.id = userInfo.id

			if (this.id) {
				this.rq.getData('user_enter/status').then(res => {
					this.loading = false
					if (res.data) {
						if (res.data.status == 0) {
							this.isPass = 9
							// uni.redirectTo({
							// 	url:'/subpages/settled/commit'
							// })
						}
						if (res.data.status == 1) {
							this.isPass = 1
							if (!userInfo || !userInfo.group_id || userInfo.group_id <= 1) {
								/* 如果当前用户信息不是达人，通过刷新用户信息 */
								that.rq.getData('user/index').then(ress => {
									userInfo = ress.data
									uni.setStorageSync('userInfo', JSON.stringify(userInfo))
								})
							}

						}
						if (res.data.status == 2) {
							this.isPass = 2
							this.msg = res.data.msg ? res.data.msg : ''
						}
						// if(res.data.status==-1){
						// 	this.isPass = -1
						// 	this.msg = res.data.msg?res.data.msg:''
						// }
					} else {
						this.isPass = 0
					}

					// this.isPass = 0

					uni.hideLoading({})
				})
			}
		},
		methods: {
			getDetail(id) {
				this.rq.getData('user_enter/detail', {
					id: id
				}).then(({
					data
				}) => {
					this.editUserInfo = {
						id: id,
						avatar: data.avatar,
						nickname: data.nickname,
						gender: data.gender,
						age: data.age,
						cm: data.cm,
						kg: data.kg,
						occupation: data.occupation,
						bio: data.bio,
						mobile: data.mobile,
						wechat_account: data.wechat_account,
						breviary_image: data.breviary_image,
						video_files: data.video_files,
						images: data.images.join(','),
						tags:data.tags?data.tags.id:null,
						real_name: data.real_name,
						front_image: data.front_image,
						reverse_image: data.reverse_image,
						is_real: data.is_real,
						province_id: data.province.id,
						city_id: data.city.id,
						district_id: data.district.id
					}
					this.sex = data.gender == 1 ? '男' : '女'
					this.uploadPhoto = data.images.length > 0 ? '已上传' : '请上传'
					this.uploadImage = data.breviary_image ? '已上传' : '请上传'
					this.uploadVideo = data.video_files ? '已上传' : '请上传'
					this.realName = data.real_name ? '已上传' : '请上传'
					this.category = data.tags?data.tags.name:''
					this.city = data.province.name + '-' + data.city.name + '-' + data.district.name
					
					this.rq.getData('common/category', {
						city_id: data.city.id
					}).then(res => {
						this.columnsCategory = res.data ? [res.data] : []
					})
				})
			},
			chooseAvatar(e) {
				let _this = this
				// #ifdef MP-WEIXIN
				let tempFile = e.detail.avatarUrl
				getApp().uploadFile([tempFile], {}, url => {
					_this.editUserInfo = {
						..._this.editUserInfo,
						avatar: url[0]
					}
				})
				// #endif
				// #ifndef MP-WEIXIN				
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: function(res) {
						getApp().uploadFile(res.tempFilePaths, {}, url => {
							_this.editUserInfo = {
								..._this.editUserInfo,
								avatar: url[0]
							}
							console.log(_this.editUserInfo)
						})
					}
				})
				// #endif
			},
			getName(e) {
				this.editUserInfo.nickname = e
			},
			areaChange(e) {
				this.city = e.data.join('-')
				this.editUserInfo.province_id = e.id[0] ? e.id[0] : ''
				this.editUserInfo.city_id = e.id[1] ? e.id[1] : ''
				this.editUserInfo.district_id = e.id[2] ? e.id[2] : ''
				this.category = ''
				this.editUserInfo.tags = null
				this.rq.getData('common/category', {
					city_id: e.id[1]
				}).then(res => {
					this.columnsCategory = res.data ? [res.data] : []
				})
			},
			receiveReal(dataArray) {
				this.editUserInfo = {
					...this.editUserInfo,
					front_image: dataArray.front_image,
					reverse_image: dataArray.reverse_image,
					real_name: dataArray.real_name,
				};
				this.realName = '已上传'
			},
			receiveVideo(dataArray) {
				this.editUserInfo = {
					...this.editUserInfo,
					video_files: dataArray.join()
				};
				this.uploadVideo = '已上传'
			},
			receiveImage(dataArray) {
				this.editUserInfo.breviary_image = dataArray.join()
				this.uploadImage = '已上传'
			},
			receivePhoto(dataArray) {
				this.editUserInfo.images = dataArray.join()
				this.uploadPhoto = '已上传'
			},
			receiveJianjie(dataArray) {
				this.editUserInfo = {
					...this.editUserInfo,
					bio: dataArray.content
				};
			},
			changeRadio() {
				this.radio = !this.radio
			},
			confirmSex(e) {
				console.log(e)
				this.editUserInfo.gender = e.value[0].id
				console.log(this.editUserInfo.gender, "this.editUserInfo.gender")
				this.sex = e.value[0].label
				this.showSex = false
			},
			confirmCategory(e) {
				console.log(e.value[0])
				this.category = e.value[0] ? e.value[0].name : ''
				this.editUserInfo.tags = e.value[0] ? String(e.value[0].service_id) : ''
				this.showCategory = false
			},
			submit() {
				if (!this.editUserInfo.avatar) {
					uni.showToast({
						title: '请上传头像',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.nickname) {
					uni.showToast({
						title: '请输入昵称',
						icon: 'none'
					})
					return
				}
				if (typeof(this.editUserInfo.gender) === 'undefined') {
					uni.showToast({
						title: '请选择性别',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.age) {
					uni.showToast({
						title: '请输入年龄',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.cm) {
					uni.showToast({
						title: '请输入身高',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.kg) {
					uni.showToast({
						title: '请输入体重',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.mobile) {
					uni.showToast({
						title: '请输入电话',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.wechat_account) {
					uni.showToast({
						title: '请输入微信号',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.breviary_image) {
					uni.showToast({
						title: '请上传视频缩略图',
						icon: 'none'
					})
					return
				}
				// if (!this.editUserInfo.video_files) {
				// 	uni.showToast({
				// 		title: '请上传视频',
				// 		icon: 'none'
				// 	})
				// 	return
				// }
				if (!this.editUserInfo.images) {
					uni.showToast({
						title: '请上传相册',
						icon: 'none'
					})
					return
				}
				if (!this.editUserInfo.city_id) {
					uni.showToast({
						title: '请选择城市',
						icon: 'none'
					})
					return
				}

				if (!this.editUserInfo.tags) {
					uni.showToast({
						title: '请选择类目',
						icon: 'none'
					})
					return
				}

				// if (!this.editUserInfo.real_name) {
				// 	uni.showToast({
				// 		title: '请填写实名认证信息',
				// 		icon: 'none'
				// 	})
				// 	return
				// }

				if (this.radio == false) {
					uni.showToast({
						title: '请勾选协议',
						icon: 'none',
						duration: 2000
					});
					return;
				}
				this.rq.getData('user_enter/apply', this.editUserInfo).then(res => {
					uni.redirectTo({
						url: `/subpages/settled/commit`
					})
				})
			},
			newSubmit() {
				this.getDetail(this.id)
				this.isPass = 0
				console.log('重新提交');
			},
			goPage(e) {
				let content = ''
				let url = ''
				if (e == 'jianjie') {
					content = this.editUserInfo.bio || ''
				}
				if (e == 'videoImage') {
					setTimeout(() => {
						uni.$emit('videoImage', this.editUserInfo.breviary_image || '')
					}, 1000)
				}
				if (e == 'photo') {
					setTimeout(() => {
						uni.$emit('photo', this.editUserInfo.images || '')
					}, 1000)
				}
				if (e == 'video') {
					setTimeout(() => {
						uni.$emit('video', this.editUserInfo.video_files || '')
					}, 1000)
				}
				if (e == 'real') {
					let params = {
						real_name: this.editUserInfo.real_name,
						front_image: this.editUserInfo.front_image,
						reverse_image: this.editUserInfo.reverse_image
					}
					setTimeout(() => {
						uni.$emit('real', params)
					}, 1000)
				}
				if (e.includes('?')) {
					url = `/subpages/settled/${e}&content=${content}`
				} else {
					url = `/subpages/settled/${e}?content=${content}`
				}
				uni.navigateTo({
					url: url
				})
			},
			// 协议
			agreement(type,title) {
				uni.navigateTo({
					url: '/subpages/platform/about-platform/about-platform?title='+title+'&type=' + type
				})
			}
		}
	}
</script>

<style lang="scss">
	.wx-btn {
		image {
			width: 64rpx;
			height: 64rpx;
			border-radius: 8rpx;
		}
	}

	.picker {
		display: flex;
	}

	.app-content {
		height: 100vh;
		background-color: #FFFFFF;
		display: flex;
		flex-direction: column;
		align-items: center;

		image {
			width: 56px;
			height: 56px;
			margin-top: 200rpx;
		}

		.text {
			font-family: PingFang SC;
			font-size: 16px;
			font-weight: bold;
			line-height: 14px;
			letter-spacing: 0px;
			color: #FF7681;
			margin: 40rpx 0;
		}

		.text1 {
			font-family: PingFang SC;
			font-size: 16px;
			font-weight: bold;
			line-height: 14px;
			letter-spacing: 0px;
			color: #000000;
			margin: 40rpx 0;
		}

		.text2 {
			font-family: PingFang SC;
			font-size: 14px;
			font-weight: normal;
			line-height: 14px;
			letter-spacing: 0px;
			margin-top: 20rpx;
			color: #999999;
		}

		.btn {
			width: 80%;
			font-weight: bold;
			font-size: 28rpx;
			color: #FFFFFF;
			line-height: 38rpx;
			text-align: center;
			line-height: 74rpx;
			// margin: 15rpx 64rpx;
			background: #FF5866;
			border-radius: 102px;
			border: 1px solid #FF5866;
			margin-top: 380rpx;
		}


		.text9 {
			font-family: PingFang SC;
			font-size: 16px;
			font-weight: normal;
			line-height: 14px;
			letter-spacing: 0px;
			color: #FF7681;
			margin: 40rpx 0;
		}

		.text19 {
			font-family: PingFang SC;
			font-size: 14px;
			font-weight: normal;
			line-height: 14px;
			letter-spacing: 0px;
			color: #999999;
		}
	}

	.content {
		padding-bottom: 250rpx;

		.check {
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 12px;
			font-weight: normal;
			line-height: 20px;
			letter-spacing: 0px;
			margin: 0 30rpx;
			color: #999999;
			display: flex;
			margin-top: 18rpx;
			align-items: center;

			.text {
				color: #333333
			}
		}
	}

	.title {
		margin: 30rpx;
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: normal;
		line-height: 14px;
		letter-spacing: 0px;

		font-variation-settings: "opsz" auto;
		color: #6E6E6E;
	}

	.a1 {
		margin: 20rpx;
		margin-bottom: 0;
		background-color: #fff;
		border-radius: 20rpx;
		padding: 40rpx 30rpx 0;
		padding-bottom: 5rpx;
		display: flex;
		flex-direction: column;
		gap: 25rpx;

		.flex1 {
			border-bottom: 1rpx solid #e9e9e9;
			padding-bottom: 25rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			&:last-child {
				border: none;
			}


			.item1 {
				font-size: 28rpx;
				font-weight: normal;
				line-height: 28rpx;
				letter-spacing: 0px;

				color: #333333;

				span {
					width: 15rpx;
					height: 15rpx;
					margin-right: 10rpx;
					color: red;
				}

				.must {
					width: 15rpx;
					height: 15rpx;
					margin-right: 10rpx;
					color: red;
				}
			}

			.item2 {
				display: flex;
				align-items: center;
				gap: 20rpx;
				font-family: PingFang SC;
				font-size: 28rpx;
				font-weight: normal;
				line-height: 28rpx;
				text-align: right;
				letter-spacing: 0px;
				color: #999999;


			}

			.item2>view {
				color: #C0C4CC;
				font-size: 28rpx;
				// font-weight: bold;
				text-align: right;
				display: inline;
				margin: 0;
				padding: 0;
			}
		}
	}

	.bottom {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: #ffffff;
		z-index: 999;

		.btn {
			font-weight: bold;
			font-size: 28rpx;
			color: #FFFFFF;
			line-height: 38rpx;
			text-align: center;
			line-height: 88rpx;
			margin: 15rpx 64rpx;
			background: #FF5866;
			border-radius: 102px;
			border: 1px solid #FF5866;
		}
	}
</style>